﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="operamasks-ui-1.1/js/jquery.min.js"></script>
    <script src="operamasks-ui-1.1/js/operamasks-ui.min.js"></script>
    <link rel="stylesheet" href="operamasks-ui-1.1/css/default/om-default.css" />
    <script type="text/javascript">
        $(function () {

            var element = $('#page').omBorderLayout({
                panels: [{
                    id: "north-panel",
                    title: "This is north panel",
                    region: "north",
                    resizable: true,
                    collapsible: true,
                    closable: true
                }, {
                    id: "south-panel",
                    title: "This is south panel",
                    region: "south",
                    resizable: true,
                    collapsible: true,
                    height: 80
                }, {
                    id: "center-panel",
                    header: false,
                    region: "center"
                }, {
                    id: "west-panel",
                    resizable: true,
                    collapsible: true,
                    title: "This is west panel",
                    region: "west", width: 250
                }, {
                    id: "east-panel",
                    resizable: true,
                    collapsible: true,
                    title: "This is east panel",
                    region: "east",
                    width: 150
                }]
            });

        });
    </script>
</head>
<body>
    <div id="page">
        <div id="north-panel">
            north</div>
        <div id="center-panel">
            center</div>
        <div id="east-panel">
            east</div>
        <div id="west-panel">
            west</div>
        <div id="south-panel">
            sorth</div>
    </div>
    <!--
    <input id="place" /><input type="button" id="btn" />
    <div id="mapSelector" title="地图选择器">
    </div> -->
</body>
</html>
